<template>
    <div>
        <!-- 基本信息 -->
        <div class="basic">
            <div class="header">
                <div class="title">
                    <span>机构基本信息</span>
                </div>
            </div>
            <div style="padding-bottom: 10px; margin-left: 10px;">
                <el-form :label-position="labelPosition" label-width="120px" :model="externalForm">
                    <el-form-item label="机构名称">
                        <el-input v-model="externalForm.agentName" clearable></el-input>
                    </el-form-item>
                    <el-row>
                        <el-col :span="12">
                            <el-form-item label="资质证书编号">
                                <el-input v-model="externalForm.qualifiCertifiId" clearable></el-input>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="资质有效期">
                                <el-date-picker v-model="externalForm.effectiveTime" type="date" format="yyyy 年 MM 月 dd 日"
                                                value-format="yyyy-MM-dd" placeholder="选择日期" clearable/>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="12">
                            <el-form-item label="批准机关">
                                <el-input v-model="externalForm.approvalDept" clearable/>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="批准文号">
                                <el-input v-model="externalForm.approvalCode" clearable/>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-form-item label="业务范围">
                        <el-input v-model="externalForm.businessScope" clearable />
                    </el-form-item>
                    <el-form-item label="公司官网">
                        <el-input v-model="externalForm.web" clearable />
                    </el-form-item>
                    <el-row>
                        <el-col :span="12">
                            <el-form-item label="技术负责人">
                                <el-input v-model="externalForm.technicalDirector" clearable/>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="过程控制负责人">
                                <el-input v-model="externalForm.processControl" clearable/>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-form>
            </div>
        </div>

        <div class="basic">
            <div class="header">
                <div class="title">
                    <span>企业详情</span>
                </div>
            </div>
            <div style="padding-bottom: 10px; margin-left: 10px;">
                <el-form :label-position="labelPosition" label-width="150px" :model="externalForm">
                    <el-form-item label="法人营业执照编号">
                        <el-input v-model="externalForm.legalRepCode" clearable />
                    </el-form-item>
                    <el-row>
                        <el-col :span="12">
                            <el-form-item label="颁发日期">
                                <el-date-picker v-model="externalForm.issueTime" type="date" format="yyyy 年 MM 月 dd 日"
                                                value-format="yyyy-MM-dd" placeholder="选择日期" clearable/>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="注册资金（万元）：">
                                <el-input v-model="externalForm.funding" clearable />
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="12">
                            <el-form-item label="颁发机关：">
                                <el-input v-model="externalForm.issueGov" clearable />
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="有效期：">
                                <el-date-picker v-model="externalForm.legalRepEffectiveTime" type="date" format="yyyy 年 MM 月 dd 日"
                                                value-format="yyyy-MM-dd" placeholder="选择日期" clearable/>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="12">
                            <el-form-item label="注册地址：">
                                <el-input v-model="externalForm.regAddress" clearable/>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="办公地址：">
                                <el-input v-model="externalForm.workAddress" clearable/>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-form-item label="公司监督电话：">
                        <el-input v-model="externalForm.companySuperTele" clearable />
                    </el-form-item>
                    <el-row>
                        <el-col :span="12">
                            <el-form-item label="传真：">
                                <el-input v-model="externalForm.companyFax" clearable />
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="邮政编码：">
                                <el-input v-model="externalForm.companyZipCode" clearable />
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-form-item label="法定代表：">
                        <el-input v-model="externalForm.companyLegRep" clearable />
                    </el-form-item>
                    <el-row>
                        <el-col :span="12">
                            <el-form-item label="电话：">
                                <el-input v-model="externalForm.legRepTel" clearable />
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="移动电话：">
                                <el-input v-model="externalForm.legRepMobile" clearable />
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-form-item label="机构负责人">
                        <el-input v-model="externalForm.companyCharger" clearable></el-input>
                    </el-form-item>
                    <el-row>
                        <el-col :span="12">
                            <el-form-item label="电话">
                                <el-input v-model="externalForm.chargerTel" clearable/>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="移动电话">
                                <el-input v-model="externalForm.chargerMobile" clearable/>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-form>
            </div>
        </div>

        <div class="basic">
            <div class="header">
                <div class="title">
                    <span>在渝办公信息</span>
                </div>
            </div>
            <div style="padding-bottom: 10px; margin-left: 10px;">
                <el-form :label-position="labelPosition" label-width="120px" :model="externalForm">

                    <el-form-item label="在渝办公地址">
                        <el-input v-model="externalForm.cqWorkAddress" clearable />
                    </el-form-item>
                    <el-form-item label="在渝负责人">
                        <el-input v-model="externalForm.cqCharger" clearable />
                    </el-form-item>
                    <el-row>
                        <el-col :span="12">
                            <el-form-item label="电话">
                                <el-input v-model="externalForm.cqChargerTel" clearable/>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="移动电话">
                                <el-input v-model="externalForm.cqChargerMobile" clearable/>
                            </el-form-item>
                        </el-col>
                    </el-row>
                    <el-row>
                        <el-col :span="12">
                            <el-form-item label="登记日期">
                                <el-date-picker v-model="externalForm.registrationTime" type="date" format="yyyy 年 MM 月 dd 日"
                                                value-format="yyyy-MM-dd" placeholder="选择日期" clearable/>
                            </el-form-item>
                        </el-col>
                        <el-col :span="12">
                            <el-form-item label="登记有效日期">
                                <el-date-picker v-model="externalForm.registrationEffectiveTime" type="date" format="yyyy 年 MM 月 dd 日"
                                                value-format="yyyy-MM-dd" placeholder="选择日期" clearable/>
                            </el-form-item>
                        </el-col>
                    </el-row>
                </el-form>
            </div>
        </div>
        <div style="margin-left: 500px;">
            <el-button type="primary" @click="addExternal">确 认 提 交</el-button>
            <div style="margin-left: 15px; display: inline-block;">
                <router-link :to="{name: 'OutsideSafetyEvaluationOrganizationIndex'}">
                    <el-button plain type="primary">取 消</el-button>
                </router-link>
            </div>
        </div>
    </div>
</template>

<script>
import {Message} from 'element-ui'

export default {
    name: 'AddExternalAgent',
    data() {
        return {
            externalForm: {},
            labelPosition: 'right'
        }
    },
    methods: {
        addExternal() {
            this.postRequest('/system/externalAgent/addExternalTechService', this.externalForm).then(resp => {
                if (resp) {
                    Message.success('添加成功')
                    this.$router.push({path: '/outside_safety_evaluation_organization/index'})
                }
            })
        }
    }
}
</script>

<style lang="scss" scoped>
.basic {
    margin: 20px;
    background: #fff;
}
.header {
    padding-top: 15px;
    padding-bottom: 15px;
}
.name {
    color: #888;
    overflow: hidden;
    white-space: nowrap;
    font-size: 16px;
}
.el-input {
    width: 300px;
}
.title {
    margin-left: 20px;
    color: #337ab7;
}
.mt {
    border-collapse: collapse;
    margin-left: 20px;
}
.first {
    display: flex;
    margin-left: 40px;
    margin-bottom: 25px;
    align-items: center;
}
.one {
    display: flex !important;
}
.updateProfGroup {
    width: 200px;
    margin-left: 8px;
}
.tag {
    margin-top: 20px;
    margin-left: 30px;
}
</style>

